<template>
    <div>
        <el-button @click="add">新增</el-button>
         <el-row :gutter="20" v-for="(item,index) in list" :key="index" > 
        <el-col :span="8" @click="clicka(e)">
        <el-upload
        action="http://121.36.92.84:9000/courseAttFileUpload"
        :on-success="handleAvatarAddSuccess1"
        :file-list="item.wenjian"
        :on-remove="handleRemove1"
        :limit="1"
        :data='{school:school}'
        >
        <el-button size="small" type="primary" @click="dian(index)">{{$t('message.clickUpload')}}</el-button>
        </el-upload>
        </el-col>

        <el-col :span="8">
        <el-upload
        action="http://121.36.92.84:9000/courseAttFileUpload"
        :on-success="handleAvatarAddSuccess2"
        :file-list="item.fengmian"
        :on-remove="handleRemove2"
        :limit="1"
        :data='{school:school}'
        >
        <el-button size="small" type="primary" @click="dian2(index)">{{$t('message.clickUpload')}}</el-button>
        </el-upload>
        </el-col>

        <el-col :span="8">
            <el-button @click="del(index)">删除</el-button>
        </el-col>
        </el-row>

        <el-button @click="xiugai">修改数据</el-button>
    </div>
</template>

<script>
    export default {
        data() {
            return {
                list:[
            {
                wenjian:[],
                fengmian:[]
            }
        ],
        list2:[],
        index:null,
        school:'aa'
            }
        },
        methods: {
            handleAvatarAddSuccess1(res, file ,fileList){
                // console.log(index);
                console.log(res,file,fileList);
                
                const {fileName,file_url} = file.response
                this.list[this.index].wenjian.push({name:fileName,file_path:file_url,file_type:'05',att_id:''})
                console.log(this.list,'list');
            },
             handleAvatarAddSuccess2(res, file ,fileList){
                console.log(fileList);
                const {fileName,file_url} = file.response
                this.list[this.index].fengmian.push({name:fileName,file_path:file_url,file_type:'05',att_id:''})
                console.log(this.list,'list');
            },
             handleRemove1(file, fileList){
                console.log(file, fileList,'789');
                console.log(this.list,'this.list');
                this.list.forEach(element => {
                    if(file.file_path === element.wenjian[0].file_path){
                        console.log(element,'element');
                        element.wenjian = []
                    }
                });
            },
             handleRemove2(file, fileList){
                console.log(file, fileList,'789987');
                this.list.forEach(element => {
                    if(file.file_path === element.fengmian[0].file_path){
                        console.log(element,'element');
                        element.fengmian = []
                    }
                });
            },
            dian(index){
                console.log(index,'111');
                this.index = index
            },
            dian2(index){
                console.log(index,'222');
                this.index = index
                
            },
            add(){
                this.list.push({
					wenjian:[],
                    fengmian:[]
				})		
            },
            del(index){
                this.list.splice(index,1)
                console.log(this.list,'listlistlistlistlist');
            },
            xiugai(){
                this.list2 = []
                this.list.forEach(ite => {
                    if(ite.fengmian.length !== 0){
                        this.list2.push({name:ite.wenjian[0].name,file_path:ite.wenjian[0].file_path,file_type:'05',att_id:ite.wenjian[0].att_id,fengPath:ite.fengmian[0].file_path})
                    }else{
                        console.log(222);
                        this.list2.push({name:ite.wenjian[0].name,file_path:ite.wenjian[0].file_path,file_type:'05',att_id:ite.wenjian[0].att_id,fengPath:""})
                    }
                });

                console.log(this.list2,'list2list2list2list2list2list2');
            },
            clicka(e){
                console.log(e,'indexDa');
            }
        },
    }
</script>

<style scoped>

</style>